How to Build a CSS Web Site » Introduction

Important Disclaimer

Notice: If you are accessing this tutorial by a non-visual browser or a device which doesn’t support style sheets — meaning you’ll be able to read this message — you will not be able to enjoy this tutorial since it requires style sheet support and visual browser usage. Sorry about this but it is completely out of my hands.

---

Let’s Make a CSS Web Page

Make a what, you may be asking? Well a CSS, or Cascading Style Sheet, is a file used to style a single web page — or an entire site — and position its elements. CSS is supported by the vast majority of visual browsers and offers many specific advantages (keep reading). In this tutorial I will begin with a simple Extensible Hypertext Markup Language, XHTML, layout and, using CSS, without hacks, I will position its elements and style it to make it look nice — and once done, it will remain accessible.

The Advantages of CSS

CSS, treated as a separate layer, is very beneficial as it simplifies updating or changing page styles and it reduces page load times since the browser can employ styles before it is fully rendered. Using CSS also allows the underlying web page to render in an order that makes the most sense for people who cannot support style sheets for whatever reason. You will see this on the first example page. Due to this linear layout, the page is more accessible and usable for people using assistive technologies such as screen readers and text browsers. In other words, using CSS enhances accessibility for the disabled user, for users who cannot use style sheets, and for search engine indexing spiders as well.